<template>
	<view class="flex flex-direction-column">
		<view class="approve-mask" v-show="MoreOption" @click="ToggleMoreOption"></view>
		<view class="flex flex-1 margin-bottom-30" v-if="props.isNoteArea">
			<input type="text" v-model="cNote" placeholder="请输入审批意见，建议100字以内..." class="popup-textarea"
				style="margin-top: 0;height: 30px;" />
			<!-- <textarea v-model="cNote" placeholder="请输入审批意见，建议100字以内..." class="popup-textarea"
				style="margin-top: 0;height: 30px;">
			</textarea> -->
		</view>
		<view class="flex justify-content-space-between align-items-center font-size-28">
			<view class="more-option">
				<view @click="ToggleMoreOption" style="width: 30px;"
					v-if="props.data.AppType=='审批'&&props.tabIndex=='0'">
					<!-- <eui-uicons type="more-filled" size="36" color="#000" /> -->
					<view class="iconfont icon-gengduo1" style="color: #000;font-size: 28px;text-align: left;"></view>
				</view>
				<view :class="Index==1?'more-option-content2':'more-option-content'" v-show="MoreOption">
					<view class="more-option-ul">
						<view class="more-option-list" @click="HandleMoreOption('驳回上级')">驳回上级</view>
						<view class="more-option-list" @click="HandleMoreOption('驳回节点')">驳回节点</view>
						<view class="more-option-list" @click="HandleMoreOption('后插审批人')">后插审批人</view>
						<view class="more-option-list" @click="HandleMoreOption('前插审批人')">前插审批人</view>
					</view>
					<view class="triangle-down"></view>
				</view>
			</view>
			<view class="flex a-content">
				<view class="a-button" @click="CheckAttachment" v-if="props.data.c_file_num*1>0">附件<span
						class="file-number">{{props.data.c_file_num}}</span>
				</view>
				<view class="a-button ellipsis-1" v-show="props.isStatus" @click="HandleMoreOption('状态')">状态</view>
				<view class="a-button ellipsis-1" @click="CheckApprove" v-if="props.data.AppType=='审阅'">审阅</view>
				<view class="a-button ellipsis-1" @click="TogglePopup('驳回')" v-if="props.data.AppType=='审批'&&props.tabIndex=='0'">
					驳回</view>
				<view class="a-button app-button ellipsis-1" :class="[theme]" @click="TogglePopup('同意')"
					v-if="props.data.AppType=='审批'&&props.tabIndex=='0'">同意</view>
			</view>
		</view>
		<!-- 底部弹窗：自定义查询条件 -->
		<eui-popup ref="approvePopup" background-color="#f8f8f8" type="bottom">
			<view class="popup-content">
				<view class="popup-title">
					<text><span
							:style="{color:cTitle=='驳回'?'rgba(255, 64, 0, 1)':'rgba(0, 173, 96, 1)'}">{{cTitle}}</span>确认</text>
					<view class="popup-cancel" @tap="CancelApprove">
						<eui-uicons color="#888888" type="closeempty" size="40" />
					</view>
				</view>
				<view class="popup-default-content" :style="{paddingBottom:AreaBottom+'px'}">
					<view style="padding: 15px 10px;line-height: 20px;">
						您正在{{cTitle}}[{{props.data.BillRealType}}-{{props.data.BillId}}]，请确认…
						<input type="text" v-model="cNote" placeholder="请输入审批意见，建议100字以内..." class="popup-textarea" />
						<!-- <textarea v-model="cNote" auto-height placeholder="请输入审批意见，建议100字以内..." class="popup-textarea">
						</textarea> -->
					</view>
					<view class="padding-20 flex">
						<eui-button type="base2" title="取消" @click="CancelApprove" />
						<eui-button type="base" title="确认" @click="ConfirmApprove" />
					</view>
				</view>
			</view>
		</eui-popup>
		<!-- 附件展示 -->
		<eui-popup ref="attachmentPopup" background-color="#f8f8f8" type="bottom">
			<view class="popup-content">
				<view class="popup-title">
					<text>附件</text>
					<view class="popup-cancel" @tap="CancelAttachment">
						<eui-uicons color="#888888" type="closeempty" size="40" />
					</view>
				</view>
				<view class="popup-default-content" :style="{paddingBottom:AreaBottom+'px'}">
					<scroll-view scroll-y style="height: 250px;">
						<view style="padding: 15px 15px;">
							<view class="attachment-list flex" v-for="(item,index) in accessoryList" :key="index"
								@click.stop="checkImg(item,index)">
								<view class="flex align-items-center">
									<image :src="item.c_docimg_url" style="width: 32px;height: 32px;">
									</image>
								</view>
								<view
									class="flex flex-direction-column align-items-flex-start justify-content-center margin-left-30">
									<view class="font-weight-bold">{{item.c_filename}}</view>
									<view class="font-size-24 margin-top-10">{{item.c_mk_dt}}</view>
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</eui-popup>
	</view>
</template>

<script setup lang="ts">
	import { ref, onMounted } from 'vue';
	import service from '@/common/service';
	import { storeToRefs } from 'pinia';
	import { useMainStore } from '@/store/modules/store';
	import { useLoginStore } from '@/store/modules/useLoginStore';
	import { useThemeStore } from '@/store/themeStore';
	import EuiButton from '@enjoy/mobile/components/button/button.vue';
	import EuiPopup from '@enjoy/mobile/components/popup/popup.vue';
	import EuiUicons from '@enjoy/mobile/components/uicons/uicons.vue';
	const mainStore = useMainStore();
	const LoginStore = useLoginStore();
	const themeStore = useThemeStore(); // 主题
	const { theme } = storeToRefs(themeStore);

	interface Props {
		data : object,
		Index : {
			type : number
		},
		isStatus : {
			type : boolean,
			default : true
		},
		isNoteArea : {
			type : boolean,
			default : false
		},
		tabIndex : {
			type : string
		},
	}
	const props = defineProps<Props>();
	const emit = defineEmits(["change", "changeWebview"]);
	const approvePopup = ref(null);
	const attachmentPopup = ref(null);
	const AreaBottom = ref(uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets.bottom : 0);
	const MoreOption = ref(false);
	const cTitle = ref('');
	const cNote = ref('');
	const IsIdeaCanEmpty = ref('是'); //是否允许审批意见为空
	const IsPassOnly = ref('是');//是否只允许通过
	const reqUser = ref({});//前插后插人员信息
	const accessoryList = ref([]);
	const isHavechecked = ref(false);

	const ToggleMoreOption = () => {
		MoreOption.value = !MoreOption.value;
		emit('changeWebview', !MoreOption.value);
	}
	const TogglePopup = e => {
		if (isHavechecked.value) {
			if (props.isNoteArea) {
				uni.showModal({
					title: '提示',
					content: e == '同意' ? '您确认通过该审批吗?' : (e == '驳回' ? '您确认驳回该审批吗?' : '您确认要将该审批驳回上级吗?'),
					success: function (res) {
						if (res.confirm) {
							ApproveExcute(e == '同意' ? 1 : (e == '驳回' ? 2 : 3), cNote.value, '已阅');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			} else {
				emit('changeWebview', false);
				cTitle.value = e;
				cNote.value = '';
				approvePopup.value.open('bottom');
			}
		} else {
			GetAppDefModuleInFo(e);
		}
	}
	// 查询附件
	const CheckAttachment = () => {
		LoadAttachmentList();
	}
	const CancelAttachment = () => {
		attachmentPopup.value.close();
		emit('changeWebview', true);
	}
	const HandleMoreOption = e => {
		MoreOption.value = false;
		switch (e) {
			case '驳回上级':
				TogglePopup(e);
				break;
			case '驳回节点':
				emit('changeWebview', true);
				uni.navigateTo({
					url: '/pages/ComDlgSelections/dlgSelApproveNode?item=' + JSON.stringify(props.data)
				});
				break;
			case '后插审批人':
			case '前插审批人':
				emit('changeWebview', true);
				uni.navigateTo({
					url: '/pages/ComDlgSelections/dlgSelApprovePerson?item=' + JSON.stringify(props.data) + '&type=' + e
				});
				break;
			case '状态':
				emit('changeWebview', true);
				uni.navigateTo({
					url: '/pages/OaViews/Approve/ApproveStatus?item=' + JSON.stringify(props.data) + '&tabIndex=' + props.tabIndex
				});
				break;
			default:
				break;
		}
	}
	// 审阅
	const CheckApprove = () => {
		uni.showModal({
			title: '提示',
			content: '您确认通过该审批吗?',
			success: function (res) {
				if (res.confirm) {
					ApproveExcute(1, '', '已阅');
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	}
	// 同意或者驳回
	const ConfirmApprove = () => {
		emit('changeWebview', true);
		ApproveExcute((cTitle.value == '同意' ? 1 : (cTitle.value == '驳回' ? 2 : 3)), cNote.value, '已阅');
	}
	const CancelApprove = () => {
		emit('changeWebview', true);
		approvePopup.value.close();
	}
	const ApproveExcute = (AppOperType, note, AppType) => {
		service.enjoyShowLoading('正在处理...');
		if (AppOperType != 5 && AppOperType != 6 && AppOperType != 4) {
			if (IsIdeaCanEmpty.value == '否' && (note == '' || note == undefined || note == null) && !AppType) {
				uni.showToast({
					duration: 3500,
					icon: 'none',
					title: '请填写审批意见。',
					mask: true
				});
				return false;
			}
			if (IsPassOnly.value != undefined && IsPassOnly.value == '是' &&
				AppOperType != 1) {
				uni.showToast({
					duration: 3500,
					icon: 'none',
					title: '流程配置当前审批节点只允许通过。',
					mask: true
				});
				return;
			}
		}
		let request = {
			url: LoginStore.EnjoyMain,
			data: {
				UniqueKey: "管易通40审批",
				ObjectData: {
					AppOperType: AppOperType,
					ReqUser: reqUser.value,
					SetpName: '',
					AppUser: '',
					AppSendUserNo: '',
					AppDeFineGuid: '',
					AppDeFineType: '',
					AppDetail: note,
					AppUserNo: mainStore.loginInfo.sUser,
					AppUserName: mainStore.loginInfo.sUserName,
					BillName: props.data.BillName,
					BillRealName: props.data.BillRealName,
					NodeId: props.data.AppNodeId,
					BillId: props.data.BillKey,
					...props.data
				},//mainStore.loginInfo.sUser,
				MethodName: "ApproveExcute",
			},
		}
		service.request(request, (res) => {
			if (res && res.data) {
				if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					if (ObjectData != undefined && ObjectData !=
						null && ObjectData.AlterInFo != undefined &&
						ObjectData.AlterInFo != null && ObjectData
							.AlterInFo != ''
					) {
						uni.showToast({
							icon: 'none',
							title: '审批失败:' + ObjectData
								.AlterInFo,
							mask: true,
							duration: 3500,
						});
					} else {
						// 查询待审批的数据、
						CancelApprove();
						emit('change', '');
					}
				} else {
					service.enjoyShowToast(res.data.Exception.Message)
				}
			}
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
			console.log('失败')
		});
	}
	const GetAppDefModuleInFo = e => {
		service.enjoyShowLoading('正在处理...');
		let request = {
			url: LoginStore.EnjoyMain,
			data: {
				UniqueKey: "管易通40审批",
				ObjectData: props.data,
				MethodName: "GetAppDefModuleInFo",
			},
		}
		service.request(request, (res) => {
			if (res && res.data) {
				if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					IsIdeaCanEmpty.value = ObjectData.IsIdeaEmpty;
					IsPassOnly.value = ObjectData.IsPassOnly;
					isHavechecked.value = true;
					TogglePopup(e);
				} else {
					service.enjoyShowToast(res.data.Exception.Message)
				}
			}
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
			console.log('失败')
		});
	}
	const getDocImgType = docName => {
		let fix = docName.substr(docName.lastIndexOf(".") + 1).toLowerCase();
		if (docName != undefined && docName != "" && fix != undefined) {
			if (fix == 'doc' || fix == 'docx') {
				return '/static/img/knowledge/docx.png';
			} else if (fix == 'txt') {
				return '/static/img/knowledge/txt.png';
			} else if (fix == 'ppt' || fix == 'pptx') {
				return '/static/img/knowledge/pptx.png';
			} else if (fix == 'jpg' || fix == 'png' || fix == 'bmp' || fix == 'jpeg' || fix == 'gif') {
				return '/static/img/knowledge/picture.png';
			} else if (fix == 'exe') {
				return '/static/img/knowledge/exe.png';
			} else if (fix == 'pdf') {
				return '/static/img/knowledge/pdf.png';
			} else if (fix == 'avi' || fix == 'wma' || fix == 'rmvb' || fix == 'mp4' || fix == 'mov' || fix ==
				'mpeg' || fix == 'flv' || fix == 'asf') {
				return '/static/img/knowledge/video.png';
			} else if (fix == 'html' || fix == 'xml') {
				return '/static/img/knowledge/html.png';
			} else if (fix == 'xls' || fix == 'xlsx' || 'xlsm') {
				return '/static/img/knowledge/xml.png';
			} else {
				return '/static/img/knowledge/spl.png';
			}
		} else {
			return '/static/img/knowledge/spl.png';
		}
	}
	const LoadAttachmentList = () => {
		accessoryList.value = [];
		let c_url = LoginStore.EnjoyMain;
		//H5产品附件统一存在框架数据库
		/* if (props.data.ProjectName?.toLowerCase().indexOf('rmis') >= 0) {
			c_url = LoginStore.EnjoyRMIS;
		} else if (props.data.ProjectName?.toLowerCase().indexOf('mall') >= 0 || props.data.ProjectName?.toLowerCase().indexOf('百购') >= 0) {
			c_url = LoginStore.EnjoyMall;
		} else if (props.data.ProjectName?.toLowerCase().indexOf('crm') >= 0 || props.data.ProjectName?.toLowerCase().indexOf('卡系统') >= 0) {
			c_url = LoginStore.EnjoyCRM;
		} else if (props.data.ProjectName?.toLowerCase().indexOf('RDS') >= 0 || props.data.ProjectName?.toLowerCase().indexOf('rds') >= 0) {
			c_url = LoginStore.EnjoyRDS;
		} else if (props.data.ProjectName?.toLowerCase().indexOf('BCM') >= 0 || props.data.ProjectName?.toLowerCase().indexOf('bcm') >= 0) {
			c_url = LoginStore.EnjoyBCM;
		} else {
			c_url = LoginStore.EnjoyOA;
		} */
		service.enjoyShowLoading('正在处理...');
		let request = {
			url: c_url,
			data: {
				UniqueKey: "管易通40审批",
				ObjectData: {
					c_bill_type: props.data.BillRealType,
					c_bill_id: props.data.BillId,
					c_guid: props.data.BillKey,
					c_name: props.data.ProjectName,
					c_note: props.data.MdCode
				},
				MethodName: "loadAttachmentList",
			},
		}
		service.request(request, (res) => {
			if (res && res.data) {
				if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					const imgUrl = c_url.replace('/Enjoy/Service', '');
					let token = JSON.parse(uni.getStorageSync('uniIdToken'));
					// 替换+为-||
					token = token.replace(/\+/g, '-||');
					// 替换/为-|||
					token = token.replace(/\//g, '-|||');
					// 替换=为-||||
					token = token.replace(/=/g, '-||||');
					const imgType = ["gif", "jpeg", "jpg", "bmp", "png"];
					for (var i = 0; i < ObjectData.length; i++) {
						const item = ObjectData[i];
						let c_type = "";
						if (RegExp("\.(" + imgType.join("|") + ")$", "i").test(item.c_file_name)) {
							c_type = 'img';
						} else {
							c_type = 'file';
						}
						const type_name = c_type == 'img' ? item.c_file_name : item.c_name;
						accessoryList.value.push({
							c_url: imgUrl + "/File/DownLoadFile/" + item.c_guid,
							c_guid: item.c_guid,
							c_filename: item.c_name,
							c_mk_dt: item.c_modified_dt,
							c_mk_username: item.c_modified_userno,
							c_docimg_url: getDocImgType(type_name == null ? '' :
								type_name),
							c_type: c_type,
							c_img_sc: imgUrl + '/FILE/DownLoadImage/' + item.c_guid,
							c_projectName: imgUrl + "/File/DownLoadFile/" + item.c_guid,
						});
					}

					if (accessoryList.value.length > 0) {
						emit('changeWebview', false);
						attachmentPopup.value.open('bottom');
					} else {
						uni.showToast({
							icon: 'none',
							title: '暂无附件信息!',
							mask: true,
							duration: 3500,
						});
					}
				} else {
					service.enjoyShowToast(res.data.Exception.Message)
				}
			}
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
			console.log('失败')
		});
	}
	/**
	 * 附件选择，
	 * 查看图片或者下载文件
	 */
	const checkImg = (item, index) => {
		console.log("item: " + JSON.stringify(item));
		if (item.c_type == 'img') {
			const urlList = accessoryList.value.reduce((acc, kk) => {
				if (kk.c_type === 'img') {
					acc.push(kk.c_img_sc);
				}
				return acc;
			}, []);
			const _index = urlList.findIndex(i => i == item.c_img_sc);
			console.log("urlList: " + JSON.stringify(urlList));
			uni.previewImage({
				current: _index,
				urls: urlList
			})
		} else {
			let self = this;
			uni.showModal({
				title: '提示',
				content: '确定要下载该文件吗?',
				success: function (res) {
					if (res.confirm) {
						// #ifdef APP-PLUS
						if (plus.os.name != "iOS") {
							plus.runtime.openURL(item.c_projectName);
						} else {
							let options = {
								filename: '_downloads/' + item.c_filename,
								method: 'GET',
							};
							plus.io.resolveLocalFileSystemURL(options.filename,
								function (entry) {
									FileExistsCallback(entry, options, item.c_filename,
										item.c_projectName);
								},
								function (e) {
									FileNotExistsCallback(e, options, item.c_filename,
										item.c_projectName);
								}
							);
						}
						// #endif
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}
			});
		}
	}
	//文件已存在
	const FileExistsCallback = (entry, options, filename, guid) => {
		uni.showModal({
			title: '提示',
			content: '选择的文件已下载过,是否直接打开',
			success: function (res) {
				if (res.confirm) {
					// 直接打开
					// #ifdef APP-PLUS
					plus.runtime.openFile(options.filename, function (e) {
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: "无法打开此文件：" + e.emssage,
							mask: true,
						});
					});
					// #endif
				} else if (res.cancel) { }
			}
		});
	}
	//文件不存在回调函数
	const FileNotExistsCallback = (e, options, filename, c_url) => {
		downLoadFile(options, filename, c_url);
	}
	const downLoadFile = (option, filename, c_url) => {
		// #ifdef APP-PLUS
		let i = 0;
		let updateWatting = plus.nativeUI.showWaiting("正在准备下载文件...");
		let downUrl = c_url;
		let dtask = plus.downloader.createDownload(c_url, option);
		dtask.addEventListener("statechanged", function (task, status) {
			if (!dtask) {
				return;
			}
			switch (task.state) {
				case 1: // 开始
					updateWatting.setTitle("开始下载...");
					break;
				case 2: // 已连接到服务器
					updateWatting.setTitle("链接到服务器...");
					break;
				case 3: // 已接收到数据
					updateWatting.setTitle("已下载:" + task.downloadedSize + "/" + task.totalSize);
					break;
				case 4: // 下载完成
					updateWatting.close();
					uni.showToast({
						duration: 3500,
						icon: 'none',
						title: '下载完成!',
						mask: true,
					});
					plus.runtime.openFile(option.filename, function (e) {
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: "无法打开此文件：" + e.emssage,
							mask: true,
						});
					});
					break;
			}
		});
		dtask.start();
		// #endif
	}
	onMounted(() => {
		console.log("props.data: " + JSON.stringify(props.data));
	})
</script>

<style lang="scss" scoped>
	@import '@/main.scss';

	.iconfont {
		font-size: 36px;
		width: 40px;
		height: 100%;
		text-align: center;
		line-height: 37px;
		@include themeText("themeText");
	}

	.flex {
		display: flex;
	}

	.flex-1 {
		flex: 1;
	}

	.justify-content-space-between {
		justify-content: space-between;
	}

	.align-items-center {
		align-items: center;
	}

	.align-items-flex-start {
		align-items: flex-start;
	}

	.text-align-right {
		text-align: right;
	}

	.padding-top-20 {
		padding-top: 20rpx;
	}

	.font-size-28 {
		font-size: 28rpx;
	}

	.font-size-24 {
		font-size: 24rpx;
	}

	.a-button {
		font-size: 13px;
		line-height: 1;
		padding: 7px 34rpx;
		border: solid 1rpx rgba(136, 136, 136, 1);
		border-radius: 26px;
		margin-right: 10px;
	}

	.a-content .a-button:last-child {
		margin-right: 0px;
	}

	.app-button {
		background: var(--theme-bgc-color);
		border: solid 1rpx var(--theme-color);
		color: #fff;
	}

	.more-option {
		position: relative;
	}

	.more-option-content {
		position: absolute;
		background-color: #fff;
		font-size: 13px;
		width: max-content;
		bottom: 32px;
		border-radius: 10px;
		color: #333;
		box-shadow: 0px 0px 10px rgba(136, 136, 136, 0.5);
		text-align: center;
		left: -8px;
		z-index: 9999;

		.triangle-down {
			position: absolute;
			width: 0px;
			height: 0;
			border-left: 8px solid transparent;
			border-right: 8px solid transparent;
			border-top: 10px solid white;
			z-index: 1;
			bottom: -9px;
			left: 10px;
		}
	}

	.more-option-content2 {
		position: absolute;
		background-color: #fff;
		font-size: 13px;
		width: max-content;
		top: 32px;
		border-radius: 10px;
		color: #333;
		box-shadow: 0px 0px 10px rgba(136, 136, 136, 0.5);
		text-align: center;
		left: -8px;
		z-index: 9999;

		.triangle-down {
			position: absolute;
			width: 0px;
			height: 0;
			border-left: 8px solid transparent;
			border-right: 8px solid transparent;
			border-bottom: 10px solid white;
			z-index: 1;
			top: -10px;
			left: 10px;
		}
	}

	.more-option-ul {
		padding: 0px 18px;
	}

	.more-option-list {
		padding: 15px 0px;
		font-size: 30rpx;
		border-bottom: solid 1px rgba(238, 238, 238, 1);
		text-align: left;
	}

	.more-option-list:last-child {
		border-bottom: none;
	}



	.popup-content {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		padding: 0;
	}

	.popup-title {
		width: 100%;
		height: 84rpx;
		background: #FFFFFF;
		border-radius: 40rpx 40rpx 0 0;
		display: flex;
		justify-content: center;
		align-items: center;
		color: $uni-text-color-secondary;
		font-size: $uni-font-size-level1;
		line-height: 45rpx;
		text-align: center;
		position: relative;
	}

	.popup-cancel {
		position: absolute;
		right: 32rpx;
		top: 0;
		height: 100%;
		display: flex;
		align-items: center;
	}

	.popup-default-content {
		width: 100%;
		background: $uni-bg-color-inverse;
		display: flex;
		flex-direction: column;
		border-top: 1rpx solid $uni-line-color;
	}

	.padding-20 {
		padding: 20rpx;
	}

	.popup-textarea {
		font-size: 14px;
		background-color: rgb(249, 249, 248);
		margin-top: 10px;
		width: 100%;
		padding: 5px;
		height: 68rpx;
		box-sizing: border-box;
		border-radius: 4px;
	}

	.file-number {
		position: relative;
		font-size: 10px;
		top: -5px;
	}

	.flex-direction-column {
		flex-direction: column;
	}

	.justify-content-center {
		justify-content: center;
	}

	.attachment-list {
		height: 55px;
		border-radius: 10px;
		background-color: rgba(249, 249, 248, 1);
		margin-bottom: 10px;
		padding: 0 10px;
		font-size: 14px;
	}

	.font-weight-bold {
		font-weight: bold;
	}

	.margin-top-10 {
		margin-top: 10rpx;
	}

	.margin-left-30 {
		margin-left: 30rpx;
	}

	.margin-bottom-30 {
		margin-bottom: 30rpx;
	}

	.approve-mask {
		position: fixed;
		z-index: 999;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.5);
	}
	
	.ellipsis-1 {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}
</style>